import React from 'react';
import { Select, Spin } from 'antd';

import { useGradeList } from '../../hooks';

// 职级
const GradeSelector = React.forwardRef(({ query, setRankValue, value, onChange, ...rest }, ref) => {
    const [gradeLoading, gradeList] = useGradeList(query);

    // 填写初始值
    // React.useEffect(() => {
    //     if (value) onChange(value);
    // }, [gradeList]);

    return (
        <Spin spinning={gradeLoading}>
            <Select
                ref={ref}
                placeholder="请选择"
                value={value}
                onChange={onChange}
                optionFilterProp="children"
                allowClear
                getPopupContainer={trigger => trigger.parentElement}
                {...rest}
            >
                {gradeList.map(item => (
                    <Select.Option key={item.rankCode} value={item.rankCode}>
                        {item.rankValue}
                        {item.state === 1 ? ' (变更审批中)' : ''}
                        {item.state === 2 ? ' (变更待生效)' : ''}
                    </Select.Option>
                ))}
            </Select>
        </Spin>
    );
});
export default GradeSelector;
